import { Dialog, Toast } from 'antd-mobile'
import React from 'react'
import { useNavigate } from 'react-router-dom'
import PubNav from '../../components/publicComponents/pubNav'
import style from './index.module.css'

export default function SetUserInfo() {
  const navigate = useNavigate()
  return (
    <div style={{ paddingTop: '46px' }}>
      <PubNav title="设置" />
      <div className={style['set-user-info']}>
        {/* 个人资料 */}
        <div
          className={style['edit']}
          onClick={() => {
            navigate('/update')
          }}
        >
          <div className={style['title']}>修改个人资料</div>
          <div className={style['icon']}>
            <img src="/static/arrow/icon-arrow-right-9e9.png" alt="" />
          </div>
        </div>
        {/* 收货地址 */}
        <div
          className={style['edit']}
          onClick={() => {
            navigate('/address/get')
          }}
        >
          <div className={style['title']}>收货地址</div>
          <div className={style['icon']}>
            <img src="/static/arrow/icon-arrow-right-9e9.png" alt="" />
          </div>
        </div>
      </div>
      {/* 关于我们 */}
      <div className={style['about']}>
        <div className={style['title']}>关于我们</div>
        <div className={style['icon']}>
          <img src="/static/arrow/icon-arrow-right-9e9.png" alt="" />
        </div>
      </div>
      <div
        className={style['loginout']}
        onClick={async () => {
          const result = await Dialog.confirm({
            content: '确定要退出登录吗?'
          })
          if (result) {
            localStorage.removeItem('userId')
            navigate('/login')
          }
        }}
      >
        <div className={style['title']}>退出登录</div>
        <div className={style['icon']}>
          <img src="/static/arrow/icon-arrow-right-9e9.png" alt="" />
        </div>
      </div>
    </div>
  )
}
